<template>
    <div>
        <cus-modal ref="modal" title="个性化菜肴审核" width="1080" :loading="loadingModal" :showOkBtn="false">
            <cusTable border :columns="columns" :data="adjistData" :bottomClass="['cus-page']">
                <template slot-scope="{ row }" slot="operation">
                    <div class="flex">
                        <Button class="mr_10" type="primary" size="small"
                            :style="{ color: '#ffffff', padding: '0 8px' }" @click="onDishAudit(row)">审核</Button>
                        <Button class="mr_10" type="primary" size="small" v-permission="30"
                            :style="{ color: '#ffffff', padding: '0 8px' }" @click="onDetails(row)">菜肴详情</Button>

                    </div>
                </template>

            </cusTable>
            <div style="width: 100%; display: flex; justify-content: flex-end">
                <cus-page :data="pages" class="mt_20" @pageChange="dishSearchListApi()"></cus-page>
            </div>
        </cus-modal>
        <addDishesModal ref="addDishesModal" ></addDishesModal>
        <auditDishModal ref="auditDishModal" @refetch="dishSearchListApi()"></auditDishModal>
    </div>
</template>

<script>

import {
    dishSearchList,
    verifyPersonalizedDish
} from "@/api/organ/dishesModule";
import addDishesModal from './addDishesModal.vue';
// 菜肴审核
import auditDishModal from "./auditDishModal.vue";
export default {
    name: "addSupplyinfoModal",
    components: { addDishesModal, auditDishModal },
    data() {
        return {
            dishForm: {
                dishName: "", // 菜肴名称
                dishCategory: "", // 菜肴分类
                dishStatus: "", // 常用状态
                dishCode: "", // 菜肴编码
                isSystemDish: "",
                personalizedUnitCode: '', //所属单位
            },
            loadingModal: false,
            adjistData: [],
            pages: {
                page: 1,
                pageSize: 10,
                pageTotal: 0,
            },
            columns: [

                {
                    title: '序号',
                    width: 70,
                    type: 'index',
                    align: 'center'
                },
                {
                    title: '菜肴编号',
                    key: 'dishCode',
                    align: 'center',
                },
                {
                    title: '菜肴名称',
                    key: 'dishName',
                    align: 'center',
                },
                {
                    title: '所属单位',
                    key: 'personalizedUnitName',
                    align: 'center',
                },
                {
                    title: '备注',
                    key: 'personalizedFailReason',
                    align: 'center',
                },
                {
                    title: '操作',
                    width: 200,
                    fixed: 'right',
                    slot: 'operation',
                    align: 'center'
                },
            ],
        };
    },
    mounted() {

    },
    methods: {
        show() {
            this.$refs["modal"].show = true;
            this.dishSearchListApi()
        },
        onDetails(row) {
            this.$refs['addDishesModal'].show(true,row)
        },
        // 审核模块展示
        onDishAudit(row) {
            console.log(this.$refs['auditDishModal'],777);
            this.$refs['auditDishModal'].show(row)
        },
        // 查询列表
        dishSearchListApi() {
            this.loading = true;
            return new Promise((resolve) => {
                let obj = this.dishForm;
                obj.current = this.pages.page;
                obj.size = this.pages.pageSize;
                obj.isPersonalized = 1
                obj.personalizedStatusArr = '0'
                dishSearchList(obj).then((res) => {
                    this.loading = false;
                    if (res.code === 1) {
                        this.adjistData = res.data.list;
                        this.pages.pageTotal = res.data.total;
                        resolve();
                    }
                });
            });
        },
    },
};
</script>

<style scoped lang="less">
.permission {
    height: 300px;
    width: 500px;
    border: 1px solid #dcdee2;
    overflow-y: auto;
    border-radius: 2px;
    padding: 0 0 0 10px;
}
</style>
